body, html {
	min-width: 320px;
	max-width: 750px;
	height: auto;
	line-height: normal;
}
.font-hidden {
	overflow: hidden;
	text-overflow:ellipsis;
	white-space: nowrap;
}
.index {
	width: 100%;
	min-width: 320px;
	max-width: 750px;
	background: #fff;
	opacity: 0;
	.page-content-01 {
		position: relative;
		width: 100%;
		height: 18.52rem;
		background: url("../images/index_bg_01.png") no-repeat;
		background-size: 100% 100%;
		.number-people {
			position: absolute;
			top: 7.5rem;
			left: 0%;
			width: 100%;
			color: #E0373A;
			font-size: 2.4rem;
			text-align: center;
			strong {
			    margin-right: -5%;
				font-weight: bold;
			}
		}
	}
	.page-content-02 {
		width: 100%;
		height: 45.9rem;
		background: url("../images/index_bg_02.png") no-repeat;
		background-size: 100% 100%;
	}
	.page-content-03 {
		width: 100%;
		height: 24.57rem;
		background: url("../images/index_bg_03.png") no-repeat;
		background-size: 100% 100%;
	}
	.page-content-04 {
		width: 100%;
		height: 39.7rem;
		background: url("../images/index_bg_04.png") no-repeat;
		background-size: 100% 100%;
	}
	.page-content-05 {
		position: relative;
		width: 100%;
		height: 36.92rem;
		background: url("../images/index_bg_05.png") no-repeat;
		background-size: 100% 100%;
		text-align: center;
		.return-bottom {
			position: absolute;
			top: 27.5rem;
			left: 38%;
			width: 22%;
			height: 3.5rem;
			background: url("../images/arrow_bottom.png") no-repeat;
			background-size: 100% 100%;
			-webkit-animation: sport3 1.5s linear infinite;		
		}
	}
	.page-content-06 {
		width: 100%;
		background: #ed4d54;
		.img-illustration {
			display: block;
		}
		.img-banner-01, .img-banner-02, .img-banner-06, .img-banner-07 {
			width: 44.53%;
			height: 11.05rem;
		}
		.img-banner-01, .img-banner-06 {
			float: left;
			margin: 0 0 0.5rem 4%;
		}
		.img-banner-02, .img-banner-07 {
			float: right;
			margin: 0 4% 0.5rem 0;
		}
		.img-banner-03, .img-banner-04, .img-banner-05 {
			float: left;
			width: 92%;
			height: 9.53rem;
			margin: 0 0 0.5rem 4%;
		}
	}
	.page-content-07 {
		width: 100%;
		height: 8.57rem;
		background: url("../images/index_bg_06.png") no-repeat;
		background-size: 100% 100%;
	}
	.page-content-08 {
		position: relative;
		width: 100%;
		height: 12.63rem;
		background: url("../images/index_bg_07.png") no-repeat;
		background-size: 100% 100%;
		span {
			text-shadow: 1px 0px 1px #734209,0px 1px 1px #734209,-1px 0px 1px #734209,0px -1px 1px #734209;
		}
		.day {
			position: absolute;
			top: 4.75rem;
			left: 35%;
			color: #feef00;
			font-size: 2.5rem;
			font-weight: bold;
		}
		.hour {
			position: absolute;
			top: 7.8rem;
			left: 20%;
			color: #feef00;
			font-size: 1.4rem;
		}
		.minute {
			position: absolute;
			top: 7.8rem;
			left: 38%;
			color: #feef00;
			font-size: 1.4rem;
		}
		.second {
			position: absolute;
			top: 7.8rem;
			left: 56%;
			color: #feef00;
			font-size: 1.4rem;
		}
	}
	.page-content-09 {
		width: 100%;
		height: auto;
		padding-bottom: 3.2rem;
		background: #ED4D55;
		.data-table {
			overflow: hidden;
			width: 96%;
			padding: 0.5rem 0 1rem;
			margin: 0 auto;
			color: #fff;
			font-size: 0.9rem;
			table {
			    width: 100%;
			}
			caption {
				position: relative;
			    font-size: 1rem;
			    line-height: 2.8rem;
			    text-align: center;
			    span {
			    	position: absolute;
			    	top: 0;
			    	left: 0;
			    	font-size: 0.8rem;
			    }
			}
			tr {
			    width: 100%;
			    height: 1.2rem;
			    padding: 0.2rem 0;
			    text-align: center;
			     th {
				    text-align: center;
				}
			}
			td, th {
				padding: 0.4rem 0;
			    border: 1px solid #fff;
			}
			tbody {
			    font-size: 0.7rem;
			}
		}
	} 
	.page-content-10 {
		position: fixed;
		bottom: 0;
		width: 100%;
		min-width: 320px;
		max-width: 750px;
		padding: 1rem 0;
		background: #ED4D55;
		.enroll-btn {
			display: block;
			width: 90%;
			height: 2.2rem;
			margin: 0 auto;
			background: #feef00;
			color: #fff;
			font-size: 1rem;
			text-align: center;
			line-height: 2.2rem;
			box-shadow: 0 0 1px 1px #734209;
			text-shadow: 1px 0px 1px #734209, 0px 1px 1px #734209, -1px 0px 1px #734209, 0px -1px 1px #734209;
		}
	}
}

#music {
	width: 10%;
	height: 1.9rem;
	background: url('../images/music.png') no-repeat center top;
	background-size: 100% 100%;
    position: fixed;
    top: 10px;
    right: 10px;
	z-index: 20;
}
.rotate {
	-webkit-animation: music 1.5s infinite ease-in-out;
}
@-webkit-keyframes music {
	0%{-webkit-transform: rotate(0deg);}
	100% {-webkit-transform: rotate(360deg);}
}
@-webkit-keyframes'sport3' {
	0 {-webkit-transform: translateY(0);opacity: 1;}
	50% {-webkit-transform: translateY(0.2rem);opacity: 0.5;}
}
.share_img {
	position: fixed;
	left: 6%;
	bottom: 9rem;
	width: 15%;
	height: 2.8rem;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	background: url('../images/share.png') no-repeat left top;
	background-size: 100% 100%;
	z-index: 1;
}
.share-wrap {
	display: none;
	position: fixed;
	top: 0;
	width: 100%;
	height: 36rem;
	min-width: 320px;
	max-width: 750px;
	background: url('../images/fx_bg.jpg') no-repeat;
	background-size: 100% 100%;
	z-index: 10000;
	.close-btn {
		width: 40px;
		height: 40px;
		display: block;
		position: absolute;
		right: 20px;
		top: 20px;
		background: url('../images/close.png') no-repeat;
		background-size: 100% 100%;
		cursor: pointer;
	}
	.main_fx {
		position: absolute;
		top: 3rem;
		left: 50%;
		width: 70%;
		min-height: 0;
		overflow: hidden;
		margin-left: -35%;
		#share_txt {
			width: 100%;
			min-height: 0;
			overflow: hidden;
			text-align: center;
			font-size: 0.8rem;
			color: #fff;
			margin-bottom: 20px;
			p {
				color: #000;
				line-height: 1.2rem;
			}
		}
		#share_ma {
			width: 85%;
			height: 16rem;
			margin: 0 auto;
			padding-top: 1rem;
			background: url('../images/ma_b.png') no-repeat center;
			background-size: 100% 100%;
			img {
				display: block;
				width: 80%;
				margin: 0rem auto;
			}
		}
	}
}


.reserve {
	overflow: hidden;
	width: 100%;
	min-width: 320px;
	max-width: 750px;
	opacity: 0;
	.header {
		width: 100%;
		min-width: 320px;
		max-width: 750px;
		height: 2.5rem;
		margin-bottom: 1rem;
		background: #fff;
		z-index: 9990;
		text-align: center;
		h1 {
			color: #ED4D54;
			font-size: 1.2rem;
			line-height: 3.5rem;
		}
		.return {
			position: absolute;
			top: 0;
			left: 0;
			width: 18%;
			height: 2.2rem;
			background: url("../images/arrow_left.png") no-repeat 50% 50%;
			background-size: 16% 32%;
		}
	}
	.reserve-main {
		width: 100%;
		background: #fff;
		.reserve-form {
			box-shadow: 0 1px 6px #ccc;
		}
		label {
			overflow: hidden;
			display: block;
			width: 100%;
			height: 2.5rem;
			padding-bottom: 0.2rem;
			border-bottom: 1px solid #c8c7cc;
			font-size: 0.8rem;
		}
		span {
			float: left;
			width: 16%;
			height: 1.8rem;
			margin-left: 6%;
			line-height: 2.5rem;
		}
		input {
			float: left;
			width: 68%;
			height: 100%;
			line-height: 1rem;
		}
	}
	.reserve-btn {
		width: 100%;
		margin: 1rem auto 0;
		a {
			display: block;
			width: 90%;
			height: 2.2rem;
			margin: 0 auto 1rem;
			border-radius: 0.2rem;
			font-size: 0.9rem;
			line-height: 2.2rem;
			text-align: center;
			box-shadow: 0 1px 6px #ccc;
		}
		.confirm {
			background: #ED4D54;
			color: #fff;
		}
		.return {
			background: #f7f7f7;
			color: #454545;
		}
	}
}
